<template>
  <!-- 只能输入数字 -->
  <input-base v-model="vValue" v-bind="attrs" @itemEvent="itemEvent">
    <template #prepend="{ config }">
      <slot name="prepend" :config="config"></slot>
    </template>
    <template #append="{ config }">
      <slot name="append" :config="config"></slot>
    </template>
  </input-base>
</template>

<script setup>
import InputBase from './InputBase.vue';
import { vModelValue } from '@/utils/hooks.js';

const attrs = useAttrs();

const props = defineProps({
  modelValue: {
    type: [String, Number],
    default: '',
  },
  maxVal: {
    // 最大值
    type: Number,
  },
  minVal: {
    // 最小值
    type: Number,
  },
  point: {
    // 小数点位数
    type: Number,
    default: 0,
  },

  isThousands: {
    // 是否千分位
    type: Boolean,
    default: false,
  },
  isMinus: {
    // 是否可以为负数
    type: Boolean,
    default: false,
  },
});
const emits = defineEmits(['update:modelValue', 'itemEvent']);

const { newValue: key } = vModelValue(props, emits);
let vValue = ref(key);

// 事件集
function itemEvent(scoped) {
  const { eventName, porp, value } = scoped;
  if (eventName === 'input') handleInput(porp, value);
  if (eventName === 'blur') {
    if ((props.minVal || props.minVal === 0) && value < props.minVal) {
      vValue.value = props.minVal;
      scoped.value = props.minVal;
    } else if ((props.maxVal || props.maxVal === 0) && value > props.maxVal) {
      vValue.value = props.maxVal;
      scoped.value = props.maxVal;
    }
  }
  emits('itemEvent', scoped);
}

// input事件
function handleInput(prop, value) {
  let val = value + '';
  if (!val) return;

  // 获取第一个值
  const first = val.charAt(0);

  // 去掉除了(数字,小数点)以外的字符
  val = val.replace(/[^\d\.]/g, '');

  // 必须保证第一个为数字而不是.  如果只能为正整数，则不能有小数点
  val = props.point ? val.replace(/^\./g, '') : val.replace(/\./g, '');

  // 保证只有出现一个.而没有多个.
  val = val.replace('.', '$#$').replace(/\./g, '').replace('$#$', '.');

  const pointIndex = val.indexOf('.');
  // 保留小数截取
  if (props.point) {
    if (pointIndex > -1) val = val.substring(0, pointIndex + props.point + 1);
  }

  // 如果第一位为0，则第二位只能为点
  let zeroIndex = val.indexOf('0');
  if (first === '-' && zeroIndex === 1 && pointIndex !== 2) val = '-0';
  if (zeroIndex === 0 && pointIndex !== 1) val = '0';

  // 千分位
  if (props.isThousands && val && /\d/.test(val)) val = currency(val);

  if (first === '-' && props.isMinus) {
    val = '-' + val;
  }
  vValue.value = val;
}

// 千分位
function reverseStr(str) {
  return str.split('').reverse().join('');
}
function replace3Int(str) {
  return str.replace(/(\d{3})(?=\d)/g, '$1,');
}
function currency(str) {
  return reverseStr(replace3Int(reverseStr(str)));
}
</script>
